var code;
function drawPic() {
    var canvas = document.getElementById("canvas");
    var width = canvas.width;
    var height = canvas.height;
    var ctx = canvas.getContext("2d");
    ctx.textBaseline = "bottom";
    ctx.fillStyle = randomColor(180,240);
    ctx.fillRect(0,0,width,height);
    var str = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz123456789";
    code = "";
    for(var i = 1;i <= 4;i++){
        var txt = str[randomNum(0,str.length)];
        code=code+txt;
        ctx.fillStyle = randomColor(50,160);
        ctx.font = randomNum(90,110) + 'px SimHei';
        var x = 10 + i * 50;
        var y = randomNum(100,135);
        var deg = randomNum(-30.30);
        ctx.translate(x,y);
        ctx.rotate(deg * Math.PI /180);
        ctx.fillText(txt,0,0);
        ctx.rotate(-deg * Math.PI /180);
        ctx.translate(-x,-y);
    }

    for(var i = 0;i < 3;i++){
        ctx.strokeStyle = randomColor(40,180);
        ctx.beginPath();
        ctx.moveTo(randomNum(0,width/2), randomNum(0,height/2));
        ctx.lineTo(randomNum(0,width/2), randomNum(0,height));
        ctx.stroke();
    }

    for(var i = 0;i < 50;i++){
        ctx.fillStyle = randomColor(255);
        ctx.beginPath();
        ctx.arc(randomNum(0,width), randomNum(0,height),1,0,2* Math.PI);
        ctx.fill();
    }
    return code;
}

function randomNum(min,max) {
    return Math.floor(Math.random() * (max - min) + min);
}
function randomColor(min,max){
    var r = randomNum(min,max);
    var g = randomNum(min,max);
    var b = randomNum(min,max);
    return "rgb(" + r + "," + g + "," + b + ")";
}
$("#canvasBox").ready(function vCode(){
    createCode();
})
$("#canvasBox").unbind("click").click(function(e){
    e.preventDefault();
    refreshCode();
});
function createCode(){
    var verificationCodeErrCount = 0;
    var randomCode = drawPic();
    return randomCode;
}
function refreshCode(){
    var verificationCodeErrCount = 0;
    var refreshCode = drawPic();
    return refreshCode;
}

function changevcode() {
    var check;
    var verification = document.getElementById("verification_code").value;
    if(verification.length < 4 || verification > 4 || verification.toUpperCase() != code.toUpperCase()){
        document.getElementById("tip1").innerHTML = "验证码输入错误 x";
        document.getElementById("tip1").style.color = "#FF0000";
        document.getElementById("verification_code").focus;
        check = false;
    }else{
        document.getElementById("tip1").innerHTML = "通过 √";
        document.getElementById("tip1").style.color = "#008000";
        check = true;
    }
    return check;
}

function Tohome() {
    var check = changevcode();
    var num = document.getElementById("numPhone").value;
    var pwd = document.getElementById("password").value;
    if (num === "admin" && pwd === "123456" && check == true) {
        location.href = "./index.html";
    }else if(num.length == 0 || pwd.length == 0){
        alert("不能为空");
    }else if(check == false){
        alert("验证码错误");
        refreshCode();
    }else if(num !== "admin" & pwd !== "123456" && num.length !== 0 & pwd.length !== 0 && check == true){
        location.href = "./views/user.html";
    }else{
        alert("账号或密码错误");
    }
}